<template>
	<view>
		<view style="height: 6vh;">
			<u-navbar :isBack="false" :height="80" title="个人界面" :titleSize="60" title-color="#FFF"
				:background="{background:'linear-gradient(45deg, #0856e7,#42bdf9)'}"></u-navbar>
		</view>
		<!-- 列表组 -->
		<u-cell-group>
			<!-- 头像 -->
			<u-cell-item label="头像" :label-style="labelStyle" :arrow="false">
				<u-avatar src="/static/images/learn.png" style="height: 170px;width: 170px;"></u-avatar>
			</u-cell-item>

			<view v-if="token != ''">
				<!-- 名称 -->
				<u-cell-item label="名字" :labelStyle="labelStyle" :arrow="false">
					<view style="font-size: 0.7rem;line-height: 1.2rem;">
						DarkSKL
					</view>
				</u-cell-item>
			</view>
		</u-cell-group>
		{{token == ''}}
		<view style="position: fixed;bottom: 170px;width: 100vw;display:flex;justify-content: center;">

			<u-button v-if="token == ''" style="height: 5vh;font-size:0.7rem;width: 80vw;" type="primary" shape="circle"
				@click="OnJump('/pages/personal/login')">Login</u-button>
			<u-button v-else style="height: 5vh;font-size:0.7rem;width: 80vw;" type="error" shape="circle"
				@click="OnClickLogout">Logout</u-button>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				labelStyle: {
					fontSize: '0.7rem'
					, "margin-left": '0.7rem'
				},

			}
		}
		, methods: {
			OnJump(path) {
				uni.navigateTo({
					url: path
				})
			}
			, OnClickLogout() {
				this.$u.vuex('token', "")
			}
		}
		, onLoad() {
		}
	}
</script>

<style>

</style>
